<#-- 注意事项：
    1. 相关画面需要引用时，请在文件头添加：<#include "/common/autocomplete_skuPkg.ftl" />
    2. 引用画面对应的input的name值必须为pkgNoXXXX/pkgNameXXXX，且class要包含autocomplete
-->
<#import "/decorators/jscss.ftl" as jc />
<@jc.jsurl url = ["/assets/plugins/autocomplete/jquery.autocomplete"]/>

<script type="text/javascript">
    $(document).ready(function(){
        // 组合编号自动填充服务，同步填写组合名称
        $("input[name^=pkgNo].autocomplete").autocomplete(cxjBasePath+'merchandise/pkg/queryPkgInfoListByPkgNo.json', {
            minChars: 1,            // 自动完成激活之前填入的最小字符 
            max:12,                 // 列表条目数
            width: 400,             // 提示的宽度
            matchSubset:0,  
            scrollHeight: 300,      // 提示的高度
            matchContains: true,    // 是否只要包含文本框里的就可以
            autoFill:false,         // 自动填充

            // 解释返回的数据，把其存在数组里  
            parse:function(data) {
                var parsed = [];
                var received = JSON.parse(data);

                if (received.status !== "success")
                    return parsed;

                for (var i = 0; i < received.content.length; i++) {  
                    parsed[parsed.length] = {  
                        data:   received.content[i], 
                        value:  received.content[i].pkgNo,  
                        result: received.content[i].pkgName // 返回的结果显示内容  
                    };
                }
                return parsed;
            }, 

            // 格式化列表中的条目 row:条目对象,i:当前条目数,max:总条目数
            formatItem: function(data, i, max) {
                return '[' + data.pkgNo+ ']'+ data.pkgName;
            },

            // 配合formatItem使用，作用在于，由于使用了formatItem，所以条目中的内容有所改变，而我们要匹配的是原始的数据，
            // 所以用formatMatch做一个调整，使之匹配原始数据
            formatMatch: function(data, i, max) {
                return data.pkgNo;
            },

            // 定义最终返回的数据，比如我们还是要返回原始数据，而不是formatItem过的数据
            formatResult: function(data) {
                return data.pkgNo;
            }
        }).result(function(event, data, formatted){

            $(this).val(data.pkgNo);

            // 获取pkgName标签的name值
            var pkgNameKey = $(this).attr("name").replace("pkgNo", "pkgName");
            $("input[name=" + pkgNameKey + "]").val(data.pkgName);

            // 获取skuId标签的name值
            var skuIdKey = $(this).attr("name").replace("pkgNo", "skuId");
            $("input[name=" + skuIdKey + "]").val(data.id);
        }); 
 
        // 组合名称自动填充服务，同步填写组合编号
        $("input[name^=pkgName].autocomplete").autocomplete(cxjBasePath+'merchandise/pkg/queryPkgInfoListByPkgName.json', {
            minChars: 1,            // 自动完成激活之前填入的最小字符 
            max:12,                 // 列表条目数
            width: 400,             // 提示的宽度
            matchSubset:0,  
            scrollHeight: 300,      // 提示的高度
            matchContains: true,    // 是否只要包含文本框里的就可以
            autoFill:false,         // 自动填充

            // 解释返回的数据，把其存在数组里  
            parse:function(data) {
                var parsed = [];
                var received = JSON.parse(data);
                
                if (received.status !== "success")
                    return parsed;

                for (var i = 0; i < received.content.length; i++) {  
                    parsed[parsed.length] = {  
                        data:   received.content[i], 
                        value:  received.content[i].pkgNo,  
                        result: received.content[i].pkgName // 返回的结果显示内容  
                    };
                }
                return parsed;
            }, 

            // 格式化列表中的条目 row:条目对象,i:当前条目数,max:总条目数
            formatItem: function(data, i, max) {
                return '[' + data.pkgNo+ ']'+ data.pkgName;
            },

            // 配合formatItem使用，作用在于，由于使用了formatItem，所以条目中的内容有所改变，而我们要匹配的是原始的数据，
            // 所以用formatMatch做一个调整，使之匹配原始数据
            formatMatch: function(data, i, max) {
                return data.pkgNo;
            },

            // 定义最终返回的数据，比如我们还是要返回原始数据，而不是formatItem过的数据
            formatResult: function(data) {
                return data.pkgNo;
            }
        }).result(function(event, data, formatted){

            $(this).val(data.pkgName);

            // 获取vendorName标签的name值
            var pkgNOKey = $(this).attr("name").replace("pkgName", "pkgNo");
            $("input[name=" + pkgNOKey + "]").val(data.pkgNo);

            // 获取skuId标签的name值
            var skuIdKey = $(this).attr("name").replace("pkgName", "skuId");
            $("input[name=" + skuIdKey + "]").val(data.id);
        }); 
  
    });
</script>
